import {observer} from 'mobx-react-lite';
import {
  Path,
  Rect,
  G,
  SvgProps,
  Defs,
  Stop,
  LinearGradient,
  Circle,
  ClipPath,
  Svg,
} from 'react-native-svg';
import {useGlobalStore} from '../../mobx';
import {getColorStr} from '../../themes';

export const SvgTheme = observer((props: SvgProps) => {
  const {theme} = useGlobalStore();
  return (
    <Svg width="33" height="32" viewBox="0 0 33 32" fill="none">
      <Circle
        cx="9.67485"
        cy="22.8251"
        r="7.24819"
        transform="rotate(18.5166 9.67485 22.8251)"
        fill="url(#paint0_linear_1347_19784)"
      />
      <Path
        d="M23.7489 3.93042L23.7487 3.93051L23.7501 3.93241L30.3283 12.983C30.4583 13.2042 30.5097 13.4629 30.474 13.717C30.4383 13.9714 30.3176 14.2062 30.1314 14.3832L30.1307 14.3839L17.5839 28.0992L17.5646 28.0862L17.5021 28.1706L17.5016 28.1713L17.4276 28.2604L17.4273 28.2608L17.3743 28.3203L17.2281 28.4212C17.2281 28.4212 17.228 28.4212 17.228 28.4213C17.0733 28.5216 16.9001 28.5902 16.7187 28.6231L16.5275 28.64C16.5274 28.64 16.5273 28.64 16.5273 28.64C16.3711 28.6495 16.2147 28.6256 16.0685 28.5697C15.9224 28.5138 15.7899 28.4274 15.6799 28.3162C15.6798 28.3161 15.6797 28.316 15.6797 28.316L2.86817 14.3839L2.8682 14.3839L2.86748 14.3832C2.68161 14.206 2.56118 13.9711 2.5258 13.7168C2.49046 13.4627 2.54209 13.2041 2.67229 12.983L9.24883 3.93241L9.24894 3.93249L9.24991 3.93069C9.34487 3.75363 9.48709 3.60638 9.66074 3.50533C9.8344 3.40428 10.0327 3.35338 10.2335 3.3583V3.3583H10.2339H22.765C23.1603 3.3583 23.5545 3.55001 23.7489 3.93042ZM22.1134 5.65726L22.1217 5.65117H22.1014H10.8976V5.64091L10.8855 5.65726L5.1713 13.4169L5.16403 13.4268L5.1723 13.4358L16.519 25.8726L16.5295 25.884L16.5406 25.8732L16.8758 25.5447L16.8758 25.5448L16.8764 25.5441L27.1624 14.0898L27.163 14.0892L27.8261 13.4364L27.8353 13.4273L27.8276 13.4169L22.1134 5.65726Z"
        fill={getColorStr(theme, 'color_31')}
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="0.0299122"
      />
      <Path
        d="M21.7781 11.7202L21.7783 11.7204C21.8806 11.8164 21.9621 11.9323 22.0178 12.061C22.0735 12.1897 22.1023 12.3285 22.1023 12.4687C22.1023 12.609 22.0735 12.7477 22.0178 12.8764C21.9621 13.0051 21.8806 13.121 21.7783 13.217L21.7781 13.2172L17.272 17.5935C17.0237 17.7748 16.7771 17.8943 16.4695 17.8943C16.1581 17.8943 15.9125 17.8342 15.6663 17.5942L15.6662 17.5942L11.2219 13.2781L11.2219 13.2781L11.2217 13.2779C11.1194 13.1819 11.0379 13.066 10.9822 12.9373C10.9265 12.8086 10.8977 12.6699 10.8977 12.5296C10.8977 12.3894 10.9265 12.2506 10.9822 12.1219C11.0379 11.9932 11.1194 11.8773 11.2217 11.7813L11.2217 11.7813L11.2219 11.7811C11.4281 11.5791 11.7053 11.4659 11.9939 11.4659C12.2826 11.4659 12.5597 11.5791 12.7659 11.7811L12.766 11.7811L16.3961 15.3071L16.407 15.3177L16.4179 15.3071L20.1106 11.7202C20.3259 11.5112 20.6343 11.4061 20.9437 11.4061C21.2532 11.4061 21.562 11.5112 21.7781 11.7202Z"
        fill={getColorStr(theme, 'color_1')}
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="0.03125"
      />
      <Defs>
        <LinearGradient
          id="paint0_linear_1347_19784"
          x1="9.67485"
          y1="15.5769"
          x2="9.67485"
          y2="30.0733"
          gradientUnits="userSpaceOnUse">
          <Stop stopColor={getColorStr(theme, 'color_2')} />
          <Stop offset="1" stopColor={getColorStr(theme, 'color_1')} />
        </LinearGradient>
      </Defs>
    </Svg>
  );
});
